<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>聊天室</title>
    <meta name="keywords" content="直播 在线教育 在线考试">
    <meta name="description" content="在线培训+网络直播间+在线考试+电子文凭">
    <meta name="author" content="Jason908 yangxing1002@gmail.com China SH">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection"content="telephone=no, email=no" />
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" /><!-- 删除苹果默认的工具栏和菜单栏 -->
    <meta name="apple-mobile-web-app-status-bar-style" content="black" /><!-- 设置苹果工具栏颜色 -->
    <meta name="format-detection" content="telphone=no, email=no" /><!-- 忽略页面中的数字识别为电话，忽略email识别 -->
    <!-- 启用360浏览器的极速模式(webkit) -->
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
    <meta name="HandheldFriendly" content="true">
    <!-- 微软的老式浏览器 -->
    <meta name="MobileOptimized" content="320">
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
    <script src="http://192.168.1.78:8000/socket.io/socket.io.js"></script>
    <script>
        (function ($) {
            $.getUrlParam = function (name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if (r != null) return decodeURIComponent(r[2]);
                return null;
            }
        })(jQuery);

    </script>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/swiper.css">
    <script src="js/lib/swiper.min.js"></script>
</head>
<body>
<div class="container">

    <div class="header-info"><span></span></div>
    <div id="msg-list" class="msg-list">

    </div>
    <div class="ctrl">
        <div class="input">
            <input type="text" id="txt-message" class="content" placeholder="请输s入内容">
        </div>
        <div class="message-type">
            <select id="messageType">
                <option value="1">普通消息</option>
                <option value="2">礼物</option>
                <option value="3">主播消息</option>
            </select>
        </div>
        <div class="action">
            <button onclick="send()">发送</button>
        </div>
    </div>

</div>
<script src="js/client.js"></script>
<script>

</script>

<script>
    var user_id = $.getUrlParam('user_id'),
        room_id = $.getUrlParam('room_id'),
        nick_name = $.getUrlParam('nick_name'),
        avatar = $.getUrlParam('avatar');
    w.init(room_id, user_id, nick_name, avatar, 0, 0, 'PC');
    function send() {
        var content = document.getElementById('txt-message').value;
        var type = document.getElementById('messageType').value;
        w.sendMessage(content,type);
        document.getElementById('txt-message').value = '';
    }
    document.getElementById('txt-message').onkeyup=function (e) {
        e = e || event;
        if (e.keyCode === 13) {
            send();
        }
    };
</script>

</body>
</html>